<template>
  <div class="bigbox">
      <div class="topbox">
        <div>
          <template>
            <el-select v-model="form.region" clearable   placeholder="测点分组" @change="changefenlei"  size="medium" style="margin-right: 10px;">
              <el-option class="select" v-for="(item,index) in fenzulist" :key="index" :label="item.text" :value="item.value"></el-option>
            </el-select>
            <el-input  size="medium" @keyup.enter.native="changeinput" style="width: 300px;height: 32px;" v-model="input"  suffix-icon="el-icon-search" placeholder="请输入检索关键字"></el-input>
          </template>
        </div>
        <div><el-button type="primary" size="small" @click="dialogVisible=true" >新 增</el-button></div>
      </div>
      <div class="tablebox">
        <div class="table">
          <template>
            <el-table
              :data="tableData"
              border
              v-loading="loading"
              height="calc(100% - 1px)"
              highlight-current-row
              :header-cell-style="{background:'#f5f5f5','text-align':'center'}"
              style="width: 100%">
              <el-table-column
                prop="itemTag"
                label="测点标识"
                >
              </el-table-column>
              <el-table-column
                prop="itemName"
                label="测点名称"
                width="300">
              </el-table-column>
              <el-table-column
                prop="itemGroup"
                label="测点分组">
                <template #default="{row}">
                <span>{{fenzulist.filter(ele=>ele.value==row.itemGroup)[0]?.text }}</span>
                </template>
              </el-table-column>
              <el-table-column
                prop="dataSubType"
                label="数据模型"
                >
                <template #default="{row}">
                  <span>{{ row.dataSubType==='Analog'?'模拟量':row.dataSubType==='Cumulant'?'累积量':row.dataSubType==='StringMeasurement'?'字符串量':row.dataSubType==='DigitMeasurement'?'数字量':row.dataSubType==='UnibitMeasurement'?'单点遥信量':row.dataSubType==='BibitMeasurement'?'双点遥信量':row.dataSubType==='HealthMeasurement'?'工况状态量':row.dataSubType==='HandKnifeMeasurement'?'手车状态量':row.dataSubType==='UnibitTelecontrol'?'单点遥控量':row.dataSubType==='BibitTelecontrol'?'双点遥控量':'遥调量' }}</span>
                </template>
              </el-table-column>
              <el-table-column
                prop="dataPhase"
                label="数据相别"
                >
                <template #default="{row}">
                <span>{{ row.dataPhase?row.dataPhase+'相':'' }}</span>
                </template>
              </el-table-column>
              <el-table-column
                prop="dataUnit"
                label="数据单位">
              </el-table-column>
              <el-table-column
                prop="dataEnum"
                label="数据枚举"
                >
                <template #default="{row}">
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[0]&&(row.dataType==='YX'||row.dataType==='YC')" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                <div v-if="Object.keys(row.dataEnum)[0]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span>{{Object.keys(row.dataEnum)[0]+':' }}</span>
                  <span>{{ Object.values(row.dataEnum)[0] }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[0])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[1]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                <div v-if="Object.keys(row.dataEnum)[1]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span >{{Object.keys(row.dataEnum)[1]?Object.keys(row.dataEnum)[1]+':':'' }}</span>
                  <span>{{ Object.values(row.dataEnum)[1]?Object.values(row.dataEnum)[1]:'' }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[1])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[2]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                <div v-if="Object.keys(row.dataEnum)[2]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span>{{Object.keys(row.dataEnum)[2]?Object.keys(row.dataEnum)[2]+':':'' }}</span>
                  <span>{{ Object.values(row.dataEnum)[2]?Object.values(row.dataEnum)[2]:'' }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[2])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[3]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                <div v-if="Object.keys(row.dataEnum)[3]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span>{{Object.keys(row.dataEnum)[3]?Object.keys(row.dataEnum)[3]+':':'' }}</span>
                  <span>{{ Object.values(row.dataEnum)[3]?Object.values(row.dataEnum)[3]:'' }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[3])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[4]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                <div v-if="Object.keys(row.dataEnum)[4]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span>{{Object.keys(row.dataEnum)[4]?Object.keys(row.dataEnum)[4]+':':'' }}</span>
                  <span>{{ Object.values(row.dataEnum)[4]?Object.values(row.dataEnum)[4]:'' }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[4])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[5]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                <div v-if="Object.keys(row.dataEnum)[5]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span>{{Object.keys(row.dataEnum)[5]?Object.keys(row.dataEnum)[5]+':':'' }}</span>
                  <span>{{ Object.values(row.dataEnum)[5]?Object.values(row.dataEnum)[5]:'' }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[5])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[6]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                <div v-if="Object.keys(row.dataEnum)[6]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span>{{Object.keys(row.dataEnum)[6]?Object.keys(row.dataEnum)[6]+':':'' }}</span>
                  <span>{{ Object.values(row.dataEnum)[6]?Object.values(row.dataEnum)[6]:'' }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[6])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[7]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                <div v-if="Object.keys(row.dataEnum)[7]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span>{{Object.keys(row.dataEnum)[7]?Object.keys(row.dataEnum)[7]+':':'' }}</span>
                  <span>{{ Object.values(row.dataEnum)[7]?Object.values(row.dataEnum)[7]:'' }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[7])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[8]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                <div v-if="Object.keys(row.dataEnum)[8]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span>{{Object.keys(row.dataEnum)[8]?Object.keys(row.dataEnum)[8]+':':'' }}</span>
                  <span>{{ Object.values(row.dataEnum)[8]?Object.values(row.dataEnum)[8]:'' }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[8])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[9]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                <div v-if="Object.keys(row.dataEnum)[9]"
                class="meiju"
                style="font-size: 12px; box-sizing: border-box;">
                  <span>{{Object.keys(row.dataEnum)[9]?Object.keys(row.dataEnum)[9]+':':'' }}</span>
                  <span>{{ Object.values(row.dataEnum)[9]?Object.values(row.dataEnum)[9]:'' }}</span>
                  <span style=" cursor: pointer;"><i class="el-icon-edit" style="color: skyblue; "></i></span>
                  <span style=" cursor: pointer;"><i class="el-icon-delete" style="color: red; " @click="delmeiju(row,Object.keys(row.dataEnum)[9])"></i></span>
                  <span style=" cursor: pointer;" v-if="!Object.keys(row.dataEnum)[10]" @click="tianjia(row)"><i class="el-icon-plus"></i></span>
                </div>
                </template>
              </el-table-column>
              <el-table-column
              prop="itemImage"
                label="图标"
                align="center">
                  <template #default="{row}">
                    <img :src="'data:image/png;base64,' + row.itemImage" alt="">
                  </template>
                </el-table-column>
              <el-table-column
                prop="name"
                align="center"
                label="操作"
                >
                <template #default="{row}">
              <span @click="xiugai(row)">
                <i
                  class="el-icon-edit"
                  style="color: skyblue; margin-left: 30px ; cursor: pointer;"
                ></i
              ></span>
              <span @click="dellist(row)">
                <i
                  class="el-icon-delete"
                  style="color: red; margin-left: 30px ; cursor: pointer;"
                ></i
              ></span>
            </template>
              </el-table-column>
            </el-table>
          </template>
        </div>
        <div class="fenye">
          <el-pagination
              background
              layout="prev, pager, next"
              :current-page.sync="pageNo"
              @current-change="getcedianlist(form.region)"
              :page-size="20"
              :total="total"
            >
          </el-pagination>
        </div>
      </div>
      <div>
        <el-dialog
          :visible.sync="dialogVisible"
          width="30%"
          :showClose="false"
          >
          <div>
        <el-form :model="formdata"  label-width="140px" :rules="rules" ref="refform">
          <el-form-item label="测点分组:" prop="itemGroup">
            <el-select @change="changeselect" v-model="formdata.itemGroup" placeholder="请选择测点分组" style="width: 250px ;" size="mini" :disabled="isdisabled">
              <el-option class="select" v-for="(item,index) in fenzulist" :key="index" :label="item.text" :value="item.value" ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="测点标识:" prop="itemTag" size="80" >
              <el-input v-model="formdata.itemTag" style="width: 250px;margin-top: 5px;" size="mini" :disabled="isdisabled"></el-input>
            </el-form-item>
            <el-form-item label="测点名称:" prop="itemName">
              <el-input v-model="formdata.itemName" style="width: 250px;margin-top: 5px;" size="mini"></el-input>
            </el-form-item>
            <el-form-item label="数据类型:" prop="dataType">
            <el-select v-model="formdata.dataType" placeholder="请选择数据类型" :disabled="isdisabled" style="width: 250px;margin-right: 100px;margin-top: 5px;" size="mini">
              <el-option class="select" v-for="(item,index) in leixinglist" :key="index" :label="item.text" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="数据模型:"  prop="dataSubType">
            <el-select v-model="formdata.dataSubType" :disabled="isdisabled" placeholder="请选择数据模型" style="width: 250px;margin-top: 5px;" size="mini">
              <el-option class="select" v-for="(item,index) in moxinglist" :key="index" :label="item.text" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
          <div v-show="isshow">
            <el-form-item label="数据相别:" >
              <el-select v-model="formdata.dataPhase" placeholder="请选择数据模型" style="width: 250px;margin-top: 5px;" size="mini">
                <el-option class="select" v-for="(item,index) in xianglist" :key="index" :label="item.text" :value="item.value"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="数据单位:" >
              <el-input v-model="formdata.dataUnit" style="width: 250px;margin-top: 5px;" size="mini"></el-input>
            </el-form-item>
            <el-form-item label="转换规则:" >
              <el-select v-model="formdata.dataConvertType" placeholder="请选择数据模型" style="width: 250px;margin-top: 5px;" size="mini">
                <el-option class="select" v-for="(item,index) in guizelist" :key="index" :label="item.text" :value="item.value"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="数据精度:" prop="dataPrecision">
              <el-input v-model="formdata.dataPrecision" style="width: 250px;margin-top: 5px;" size="mini"></el-input>
            </el-form-item>
            <el-form-item label="最大值:" >
              <el-input v-model="formdata.dataMax" style="width: 250px;margin-top: 5px;" size="mini"></el-input>
            </el-form-item>
            <el-form-item label="最小值:" >
              <el-input v-model="formdata.dataMin" style="width: 250px;margin-top: 5px;" size="mini"></el-input>
            </el-form-item>
        </div>
        <el-form-item label="测点描述:" >
              <el-input type="textarea" v-model="formdata.itemExplain" style="width: 250px;margin-top: 5px;" size="mini"></el-input>
            </el-form-item>
            <el-form-item label="测点图标">
          <el-upload
            class="avatar-uploader"
            v-model="formdata.itemImage"
            action="https://jsonplaceholder.typicode.com/posts/"
            :show-file-list="false"
            :http-request="httpRequest">
            <img v-if="imageUrl" :src="imageUrl" class="avatar" style="margin-top: 10px;">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>
        </el-form>
        
      </div>
          <span slot="footer" class="dialog-footer" style="margin-right: 60px;">
          <el-button  size="small" type="primary"  @click="submit">保存</el-button>
          <el-button size="small"  @click="quxiao">取 消</el-button>
        </span>
      </el-dialog>
      </div>
      <div>
        <el-dialog
          :visible.sync="dialogVisibles"
          width="30%"
          :showClose="false"
          >
          <div>
            <el-form :rules="rule" :model="meiju">
              <el-form-item label="枚举值:" prop="enumValue" size="80" >
              <el-input v-model="meiju.enumValue" style="width: 250px;margin-top: 5px;margin-left: 15px;" size="mini" :disabled="isdisabled"></el-input>
            </el-form-item>
            <el-form-item label="枚举名称:" prop="enumName">
              <el-input v-model="meiju.enumName" style="width: 250px;margin-top: 5px;" size="mini"></el-input>
            </el-form-item>
            </el-form>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button size="small" type="primary" @click="xinmeiju">确 定</el-button>
            <el-button size="small" @click="dialogVisibles = false" >取 消</el-button>
          </span>
        </el-dialog>
      </div>
  </div>
</template>

<script>
import {
  getxialafenzuapi,
  getcedianlistapi,
  getItemTypelistapi,
  getleixingxialaapi,
  getmoxingxialaapi,
  geixiangxialaapi,
  getguizelistapi,
  getycmoxingapi,
  postcedianlistapi,
  delceshilistapi,
  putceshilistapi,
  delmeijuapi,
  postmeijuapi,puticonlogoapi
} from '@/api/ElectricalDistribution/IotTechnology/eventtype'
export default {
  name: 'MaintenanceIndex',

  data () {
    return {
      flaog: '',
      meiju: {},
      itemTag: '',
      dialogVisibles: false,
      showtext: '',
      isdisabled: false,
      isshow: true,
      dialogVisible: false,
      form: {},
      fenzulist: [],
      leixinglist: [],
      yxmoxinglist: [],
      guizelist: [],
      xianglist: [],
      moxinglist: [],
      tableData: [],
      fenzutext: '',
      input: '',
      row: '',
      formdata: {
        dataPrecision: '0'
      },
      rules: {
        itemGroup: [
          { required: true, message: '请选择测点分组', trigger: 'blur' }
        ],
        itemTag: [
          { required: true, message: '测点标识必填', trigger: 'blur' }
        ],
        itemName: [
          { required: true, message: '测点名称必填', trigger: 'blur' }
        ],
        dataType: [
          { required: true, message: '请选择数据类型', trigger: 'blur' }
        ],
        dataSubType: [
          { required: true, message: '请选择数据模型', trigger: 'blur' }
        ],
        dataPrecision: [
          { required: true, message: '精度必填', trigger: 'blur' }
        ]
      },
      rule: {
        enumValue: [
          { required: true, message: '枚举值必填', trigger: 'blur' }
        ],
        enumName: [
          { required: true, message: '枚举名称必填', trigger: 'blur' }
        ]
      },
      imageUrl: '',
      fileBase64: '',
      array:[],
      pageNo:0,
      total:0,
      loading:false
    }
  },

  async mounted () {
    const ressssss = await getycmoxingapi()
    this.yxmoxinglist = ressssss.data.list
    const resssss = await getguizelistapi()
    this.guizelist = resssss.data.list
    const ressss = await geixiangxialaapi()
    this.xianglist = ressss.data.list
    const resss = await getmoxingxialaapi()
    this.moxinglist = resss.data.list
    const ress = await getleixingxialaapi()
    this.leixinglist = ress.data.list
    const res = await getxialafenzuapi({ dictType: 'MeasurementKind' })
    this.fenzulist = res.data.list
    this.getcedianlist()
  },

  methods: {
    async getcedianlist () {
      this.loading=true
      const pageNo=this.pageNo-1
      const {data:{list,totalCount}} = await getItemTypelistapi({ itemGroup: this.form.region,pageNo ,pageSize:20,keyword:this.input})
      this.tableData = list
      this.array = list.map(ele => {
        return {'dataEnum':ele.dataEnum,'itemTag':ele.itemTag}
      })
      this.total=totalCount
      this.loading=false
    },
    changefenlei (val) {
      this.fenzutext = val
    },
    changeinput () {
      this.getcedianlist()
    },
    // 编辑
    xiugai (row) {
      if (row.itemGroup === '0') {
        this.isshow = false
        this.yxmoxinglist = this.moxinglist
      }
      // this.yxmoxinglist = this.moxinglist
      this.dialogVisible = true
      this.formdata = { ...row }
      this.imageUrl =row.itemImage? 'data:image/png;base64,' + row.itemImage:''
      this.isdisabled = true
      this.flaog = row
    },
    // 取消按钮
    async quxiao () {
      this.dialogVisible = false
      this.isshow = true
      const ressssss = await getycmoxingapi()
      this.yxmoxinglist = ressssss.data.list
      this.formdata = {}
      this.isdisabled = false
      this.flaog = ''
      this.imageUrl=''
      // this.formdata.dataPrecision = 0
      this.$set(this.formdata,'dataPrecision','0')
    },
    // 确认保存
    async submit () {
      await this.$refs.refform.validate()
      const { dataMax, dataMin, dataPhase, dataUnit, itemExplain, itemName,itemImage, itemTag, dataConvertType, dataPrecision } = this.formdata
      this.flaog ?await putceshilistapi({ dataMax,itemImage, dataMin, dataPhase, dataUnit, itemExplain, itemName, itemTag, dataConvertType, dataPrecision }) : await postcedianlistapi(this.formdata)
      this.flaog? await puticonlogoapi({itemTag,itemImage}):''
      this.flaog ? this.$message.success('修改成功') : this.$message.success('新增成功')
      this.dialogVisible = false
      this.formdata = {}
      this.getcedianlist(this.fenzutext)
      this.flaog = ''
      this.imageUrl=''
      this.formdata.dataPrecision = '0'
    },
    async dellist (row) {
      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await delceshilistapi({ itemTag: row.itemTag })
        if (res.code === 200) {
          this.$message.success('删除成功')
        }
        this.getcedianlist(this.fenzutext)
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    changeselect (val) {
      this.showtext = val
    },
    async delmeiju (row, val) {
      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        await delmeijuapi({ enumValue: val, itemTag: row.itemTag })
        this.getcedianlist(this.fenzutext)
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    tianjia (row) {
      this.itemTag = row.itemTag
      this.dialogVisibles = true
    },
    async xinmeiju () {
      await postmeijuapi({ ...this.meiju, itemTag: this.itemTag })
      this.$message.success('添加枚举成功')
      this.getcedianlist(this.fenzutext)
      this.dialogVisibles = false
      this.meiju = {}
    },
    // 文件上传
    httpRequest (data) {
      this.imageUrl = URL.createObjectURL(data.file)
      // 这是限制上传文件类型
      console.log(this.imageUrl);
      const isPFX =
        data.file.type === 'image/png';
      const isLt2M = data.file.size / 1024 / 1024 < 2
      if (!isPFX) {
        this.$message.error('上传头像图片只能是PNG格式!')
      } else if (!isLt2M) {
        this.$message.error('上传文件大小不能超过 2MB!')
      } else {
        this.getBase64(data.file).then((resBase64) => {
          this.formdata.itemImage = resBase64.split(',')[1] // 直接拿到base64信息
          console.log(this.formdata.itemImage)
        })
      }
    },
      // 这个file参数 也就是文件信息，你使用 插件 时 你就可以打印出文件信息 看看嘛
    getBase64 (file) {
      return new Promise((resolve, reject) => {
        const reader = new FileReader()
        let fileResult = ''
        reader.readAsDataURL(file)
        // 开始转
        reader.onload = function () {
          fileResult = reader.result
        }
        // 转 失败
        reader.onerror = function (error) {
          reject(error)
        }
        // 转 结束  咱就 resolve 出去
        reader.onloadend = function () {
          resolve(fileResult)
        }
      })
    },
  },
  watch: {
    fenzutext (val) {
      this.getcedianlist(val)
    },
    input (val) {
      setTimeout(()=>this.getcedianlist(this.fenzutext),500)
    },
    showtext (val) {
      if (val === '0') {
        this.isshow = false
      } else {
        this.isshow = true
      }
    }
  }
}
</script>

<style lang="scss" scoped>
 .avatar-uploader .el-upload {
  
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border: 1px solid #ccc;
    margin-top: 10px;
    border-radius: 3px;
  }
  .avatar {
    width: 30px;
    height: 30px;
    display: block;
  }
.neww{
  margin: 0 90px 0 10px;
  background-color: #fff !important;
  color: black !important;
  border: 1px solid #ccc !important;
}
// .button{
//   width: 63px;
//   height: 32px;
//   border-radius: 3px;
//   color: #fff;
//   border: 1px solid #ccc;
//   background-color: #1890ff;
// }
.select{
  padding-left: 10px;
}
.bigbox{
  padding: 10px !important;
background-color: #f1f1f1;
box-sizing: border-box;
height: 100%;

}
.tablebox{
background-color: #fff;
height: calc(100% - 90px);
padding: 10px;
.table{
  height: 93%;
}
.fenye{
  text-align: right;
  margin-top: 10px;
}
}
.topbox{
  height: 80px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
  background-color: #fff;
  padding: 20px;
}
.meiju span{
  margin-left: 5px;
}
</style>
